<%@ page contentType="text/html;charset=UTF-8" %>
<%@ page import="java.sql.*" %>
<!DOCTYPE html >
<html onclick="window.location.reload()">
<head>
    <title>商品管理</title>
    <style>
        table {
            width: 100%;
            border-collapse: collapse;
        }

        table, th, td {
            border: 1px solid black;
        }

        th, td {
            padding: 8px;
            text-align: left;
        }

        button {
            background-color: #f25d8e;
            box-shadow: 0 4px 4px rgba(255, 112, 159, .3);
            color: #e7e7e7;
            border: none;
            cursor: pointer;
            font-size: 0.8rem;
            font-weight: bold;
            letter-spacing: 0.1rem;
            padding: 5px 10px;
            text-transform: uppercase;
            transition: transform 80ms ease-in;
        }

        .tablesOfId {
            width: 80px;
        }

        .tablesOfPrice {
            width: 90px;
        }

        .tablesOfTag {
            width: 80px;
        }
    </style>
</head>
<body>
<h1>商品列表</h1>
<form action="searchProduct" method="get">
    <div>
        <label>关键字:</label>
        <input type="text" id="searchKeyword" name="searchKeyword">
        <button type="submit">搜索</button>
    </div>
</form>
<h3>
    <button onclick="AddProducts()">添加商品</button>
</h3>
<table id="productTable">
    <!-- 动态生成商品列表 -->
    <%
        // 连接数据库获取商品列表
        Connection conn = null;
        Statement stmt = null;
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/course_design", "root", "123456");
            stmt = conn.createStatement();
            ResultSet rs = stmt.executeQuery("SELECT * FROM products ORDER BY id DESC");
            while (rs.next()) {
    %>
    <tr>
        <td class="tablesOfId"><%= rs.getString("id") %>
        </td>
        <td><%= rs.getString("pid") %>
        </td>
        <td><%= rs.getString("pname") %>
        </td>
        <td class="tablesOfPrice"><%= rs.getString("pprice") %>
        </td>
        <td class="tablesOfTag"><%= rs.getString("ptag") %>
        </td>
        <td><%= rs.getString("Product_detail") %>
        </td>
        <td><img src="<%= rs.getString("url") %>" style="height: 100px;width: 100px"></td>
        <td>
            <button onclick="openEditProductWindow(<%= rs.getString("id") %>,<%= rs.getString("pname") %>,<%= rs.getString("pprice") %>
                    ,<%=rs.getString("ptag")%>,<%=rs.getString("Product_detail")%>,<%=rs.getString("url")%>)">编辑
            </button>
            <form action="DeleteProductServlet" method="post">
                <input type="hidden" name="productId" value="<%= rs.getString("id") %>">
                <button onclick="confirmDelete(<%= rs.getString("pname") %>)">删除</button>
            </form>
        </td>
    </tr>
    <%
            }
            rs.close();
        } catch (Exception e) {
            e.printStackTrace(System.err);
        } finally {
            try {
                if (stmt != null) {
                    stmt.close();
                }
                if (conn != null) {
                    conn.close();
                }
            } catch (SQLException e) {
                e.printStackTrace(System.err);
            }
        }
    %>
</table>
<div>
    <button onclick="previousPage()">上一页</button>
    <span id="currentPage"></span>
    <button onclick="nextPage()">下一页</button>
</div>
<script>
    function openAddProductModal() {
        document.getElementById("addProductModal").style.display = "block";
    }
    function confirmDelete(ProductId) {
        const confirmDelete = confirm("确认删除商品"+ProductId+"吗？");

        if (confirmDelete) {
            deleteAccount(ProductId);
        } else {
        }
    }

    function openEditProductWindow(id, productName, productPrice, productTag, productDetail, purl,) {
        const editProductUrl = "editProduct.jsp?id=" + id + "&productName=" + productName + "&productPrice=" + productPrice + "&productTag=" + productTag + "&productDetail=" + productDetail + "&purl=" + purl;
        window.open(editProductUrl, "_blank", "width=400,height=300");
    }

    function closeAddProductModal() {
        document.getElementById("addProductModal").style.display = "none";
    }

    function AddProducts() {
        window.open("addProduct.jsp", "_blank", "width=400,height=350")
    }
</script>
</body>
</html>
